import React, { Component } from 'react';
import { List } from '$yo-component';
import Header from '$component/header/index.js';
import yoHistory from '$common/history';
import './index.scss';

class Detail extends Component {
    constructor() {
        super();
        this.state = {
            dataSource: [{text:'',key:++guid}]
        };
    }
    render() {
        return (
            <div className="yo-flex">
                <Header title="我的" right={{ title: '点我', onTap: () => alert('hello') }}/>
                <List
                    ref="list"
                    extraClass="flex m-list"
                    dataSource={this.state.dataSource}
                    renderItem={(item, i) => <div className="yo-list yo-list-group">
                        <div className="item">
                            <img className="my" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1510391072247&di=7dbe66f8964de4aac6af591db0a7d207&imgtype=0&src=http%3A%2F%2Fimg.25pp.com%2Fuploadfile%2Fsoft%2Fimages%2F2015%2F0810%2F20150810105858870.jpg"/>
                            <div className="des2">
                                <p className="comment-title">范秀芳</p>
                                <p className="comment-title">web应用前端工程师</p>
                            </div>
                        </div>
                        <p className="item white" ></p>
                        <p className="item"><i className="iconfont icon-xueli"></i><span>学历水平: </span>本科</p>
                        <p className="item"><i className="iconfont icon-xuexiao"></i><span>毕业院校:</span> XXXXXX大学</p>
                        <p className="item "><i className="iconfont icon-gongzuo2"></i><span>工作经验:</span>2年</p>
                        <p className="item white" ></p>
                        <p className="item"><i className="iconfont icon-shouji"></i><span>联系方式:</span> 180XXXX7150</p>
                        <p className="item"><i className="iconfont icon-youxiang"></i><span>邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱:</span> 1004xxxxx51@qq.com</p>
                        <p className="item "><i className="iconfont icon-home"></i><span>现居住地:</span>中国·杭州</p>
                        <p className="item white" ></p>
                        <p className="item"><i className="iconfont icon-pingjia"></i>自我评价:</p>
                        <p className="item xx">天真可爱无邪善良美丽大方臭不要脸</p>
                </div>
                    }
                     infinite={false}
                     infiniteSize={20}
                     itemHeight={44}
                     usePullRefresh={false}
                     onRefresh={() => {
                         setTimeout(() => {
                             this.refresh();
                             this.refs.list.stopRefreshing(true);
                         }, 500);
                     }}
                     useLoadMore={false}
                     onLoad={() => {
                         setTimeout(() => {
                             this.fetch();
                             this.refs.list.stopLoading(true);
                         }, 500);
                     }}
                     itemExtraClass={(item, i) => {
                         return 'item ' + i;
                     }}
                     onItemTap={(item, i, ds) => {
                         yoHistory.push('/detail');
                     }}
 
                />
            </div>
        )
    }
}

let guid = -1;

function getArrayByLength(length) {
    var ret = [];
    for (var i = 0; i < length; i++) {
        ret[i] = null;
    }
    return ret;
}

function getRandomList(size) {
    return getArrayByLength(size).fill(1).map(num => parseInt(Math.random() * 100));
}

function getRandomDataSource(size) {
    return getRandomList(size).map(num => ({ text: num, key: ++guid }));
}


export default Detail;
